<template>
	<view class="pushEvaluate">
		<tui-navigation-bar :titleSize="18" :titleLineHeight="18" :titlefontWeight="800" :isOpacity="false"
			:splitLine="true" @init="initNavigation" title="意见反馈" backgroundColor="#fff" color="#000">
			<view class="tui-header-icon" :style="{ marginTop: top + 'px' }">
				<tui-icon name="arrowleft" color="#333" @click="back"></tui-icon>
			</view>
		</tui-navigation-bar>
		<view class="pushEvaluate_content" :style="{ paddingTop: marginTop + 20 + 'px' }">
			<tui-textarea isCounter :borderBottom="false" :borderTop="false" minHeight="100rpx" autoHeight
				maxlength="200" placeholder="请输入反馈意见" v-model="intro"> 
			</tui-textarea>
		</view>
		<view class="footer">
			<tui-form-button @click="publishComment" radius="70rpx" size="34" color="#fff" width="690rpx" height="84rpx"
				background="#2FD7D3">
				立即反馈
			</tui-form-button>
		</view>
	</view>
</template>

<script>
	import {putBack} from "@/http/api/index/index.js"
	import Cache from '@/utils/cache'
	export default {
		data() {
			return {
				// 导航栏
				top: 0, //标题图标距离顶部距离
				marginTop: 0, // 页面内容距离顶部的距离

				intro: '',// 反馈内容 
			}
		}, 
		methods: {
			// 导航栏
			initNavigation(e) {
				this.top = e.top;
				this.marginTop = e.height;
			},
			back() {
				uni.navigateBack();
			},
			// 发布反馈
			publishComment(){
				if(!this.intro){
					 this.$utils.toast('请输入反馈内容！')
					return;
				}
				putBack({  
					feedback: this.intro
				}).then(res => {
					if (res.code == 200) {
						 this.$utils.toast("反馈已提交");
					     uni.navigateBack();
					}
				}).catch(res => {
					this.$utils.toast(res);
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "../../../index/modules/tutorDetails/tutorDetails.scss";

	.pushEvaluate {
		background-color: #fff;
		height: 100vh;
		width: 100vw;

		.tui-header-icon {
			width: 100%;
			position: fixed;
			top: 0;
			padding: 0 0 0 38rpx;
			display: flex;
			align-items: center;
			height: 32px;
			transform: translateZ(0);
			box-sizing: border-box;
		}

		.pushEvaluate_content {
			margin-left: 20rpx;

			.tui-box-upload {
				margin-bottom: 100rpx;
			}
		}
	}
</style>